项目开发的全流程解决方案-借鉴

开发前

项目开发前，可能需要首页网站开发中的介绍或者几页的简单描述页面。此时可以考虑 ant design landing 和 umi 配合使用。可视化的页面可以使用 DataV。

开发

技术选型

静态页面（帮助文档、官网）

1. 选择 html、css、js 进行静态页面开发
2. 可以考虑使用 pug(jade)、 sass 配合 webpack 搭建静态多页面。
3. 开发项目时，可能会需要帮助文档此时可以考虑使用 vuepress 进行文档开发.还有其它 SSG-静态站点生成器 可供参考
4. 可以选择 SSR（服务端渲染）相关技术进行页面开发。

5. 静态站点生成工具 搭配 headless cms 进行开发。比如: strapi 和 hugo

   app（帮助文档、官网）

6. React Native、 weex 等
7. h5+ 嵌套页面开发 app
8. 原生 app 开发框架

9. 父子站开发架构

10. Git 版本仓库

    • 前端

      1. 可以考虑父子项目，为平级项目，公共的提取出公共的代码库，公共的部分在公共代码库中进行开发。之后，每个父项目拉取公共项目进行特性开发，同样子项目拉取公共项目进行特性开发，。最后父子项目分别部署。
      2. 可以考虑父子项目在同一个项目中进行开发。此时可以考虑设置变量，作为开发的过程中父子不同逻辑的开发控制（即渠道控制）。

      3. 可以考虑使用微前端 qiankun 进行项目的构建搭建。 spa

         • jd.com 京东设计思路（模块化）

           read.jd.com 
           www.jd.com 
           mall.jd.com 
           product.jd.com 
           sales.jd.com

    • 后端

      1. 使用模块化（可插拔）将子项目单独部署。比如提取授权中心、会员中心、登录中心、用户中心（同一套用户体系）、积分系统、门户中心、通知中心、告警信息、部署中心、文案中心 etc。(大中台，小后台)
      2. 可以使用微服务架构，进行架构开发。

11. 需求分析

    • 形成原型图，可以使用 墨刀 和 Axure。
    • 生成流程图，可以使用 Process on。

12. 开发环境准备

    • 前端

      • nvm、node、IDE、Chrome、vue-cli 或者 create-react-app

    • 后端

      • jabba、jdk、Intellij Idea

13. 组件开发

    • 页面开发最重要的就是组件库的开发，可以借鉴 ant design 、fusion design 进行自己组件的开发（组件化）。或者使用现成组件 比如： element UI

开发完

前置

1. 项目构建的时候需要考虑多环境配置和部署：开发环境、预发环境、生产环境等的开发与部署（git 的分支管理）；nginx 的使用和配置（解决跨域问题）。
2. 大型项目还要考虑，灰度问题，视情况而定。

构建部署

关于构建与部署。目前市场上有很多的概念、技术 CI/CD、k8s、Docker、负载均衡 等。
对于上手，我建议使用 github 内置的 github action （提供的 CI/CD） 进行自己项目的简单部署。关于如何从零到一通过域名访问自己的项目，体验全流程开发。打造自己的网站。我会在下一篇仔细讲解，感兴趣的可以关注。